<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
	<title>新建地址</title>
	<link rel="stylesheet" type="text/css" href="http://at.alicdn.com/t/font_474420_0o6wv3e9gbbuik9.css">
	<link rel="stylesheet" type="text/css" href="css/swiper.min.css">
	<link rel="stylesheet" type="text/css" href="css/mui.css">
	<link rel="stylesheet" type="text/css" href="css/mui.picker.min.css">
	<link rel="stylesheet" type="text/css" href="css/mui.poppicker.css">
	<link rel="stylesheet" type="text/css" href="css/style.css">
	<script type="text/javascript" src="js/fontSize.js"></script>
	<script type="text/javascript" src="js/city.data-3.js"></script>
	<script type="text/javascript" src="js/mui.min.js"></script>
	<script type="text/javascript" src="js/mui.picker.js"></script>
	<script type="text/javascript" src="js/mui.poppicker.js"></script>
	<script type="text/javascript" src="js/layer/layer.js"></script>
	<script type="text/javascript" src="js/zepto.min.js"></script>
	<script type="text/javascript" src="js/swiper.min.js"></script>
	<script type="text/javascript" src="js/vue.js"></script>
	<script type="text/javascript" src="js/jweixin-1.2.0.js"></script>
	<script type="text/javascript" src="js/config.js"></script>
</head>
<body class="add_address bgcolor">
<div id="app">
	<ul class="add_adr_ul">
		<li class="borderBottom"><span>姓名</span><input type="text" placeholder="请输入姓名"></li>
		<li class="borderBottom"><span>手机号码</span><input type="text" placeholder="请输入手机号码"></li>
		<li class="borderBottom" @click="pickCity"><span>所在地区</span>
				<input type="text" v-model.trim="city" v-if="city!=''" disabled="true">
				
				<i class="iconfont icon-xiangyou fr"></i>
			    <i class="fr" id="city"  v-if="city==''">请选择</i>
			
		</li>
	    <textarea id="jiedao" placeholder="填写详细地址，如街道、楼盘号等"></textarea>
	</ul>
	<ul class="add_adr_ul">
		<li><span>设为默认</span>
			<div class="mui-switch mui-switch-mini mui-active" id="switch">
				<div class="mui-switch-handle"></div>
			</div>
		</li>
	</ul>
	<button type="button" class="save_addresss">保存</button>
</div>
<script type="text/javascript">
	 var app = new Vue({
			el: '#app',
			data: {
			    list:[],
		        unionid:GetQueryString("unionid"),
		        flag:false,
		        city:"",
		        moren:true
		       
			},
			mounted(){
				var that=this;
 				document.getElementById("switch").addEventListener('toggle', function(event) {
 					that.moren=event.detail.isActive;
 					console.log(that.moren)
                   // if(event.detail.isActive){
                   // 	 that.moren=true;
                   // }else{
                   // 	   that.moren=false;
                   // }
				});
			},
			methods:{
				toogle:function(){
					this.flag=!this.flag;
				},
				pickCity:function(){
					var that=this;
					var cityPicker3 = new mui.PopPicker({
					    layer: 3
				    });
				    cityPicker3.setData(cityData3);
				    cityPicker3.show(function(items) {
						that.city=items[0].text+" "+items[1].text+" "+items[2].text;
					}); 	
				}

			}
		});
</script>	
</body>
</html>